//获取所有，相当于一个数组
var titles=document.getElementById("title").getElementsByTagName("h3");
var contents=document.getElementById("content").getElementsByTagName("ul");
//有数组就有下标和它本身的长度
var timer=null;
for(let i=0;i<titles.length;i++){
	titles[i].onmousemove=function(){
		console.log("移动到第"+(i+1)+"项");
		active(i);
	};
	titles[i].onmouseout=function(){
		console.log("鼠标移开左边");
		timer=setTimeout(function(){
			console.log("两秒后结束");
			contents[i].style.display="none";
		},2000);
	};
}
for(let i=0;i<contents.length;i++){
	//鼠标移动到右边，清除时间特性
	contents[i].onmousemove=function(){
		console.log("鼠标移动到右边,清除时间");
		clearTimeout(timer);
		contents[i].style.display="block";
	};
	contents[i].onmouseout=function(){
		console.log("鼠标移开右边");
		contents[i].style.display="none";
	};
}
function active(index){
	for(let i=0;i<titles.length;i++){
		if(i==index){
			titles[index].className="cur";
			contents[index].className="active";
			contents[index].style.display="block";
		}else{
			titles[i].className="";
			contents[i].className="";
			contents[i].style.display="none";
		}
	}
}